/**
 * Created by 30947 on 2018/7/20.
 */
$(function(){
    getHt();
    initMap();
    mapActive();

})

// 获取 div 的高度
function getHt(){
    var all_height=$(window).height();
    var div_height=all_height-84;
    $("#car_control").css("height",div_height+"px");
}

// 加载地图
function initMap(){
    map = L.map('map_box', {
        center: [39.830660058696104, 116.92866163503169],
        zoom: 10,
        crs: L.CRS.EPSG3857
    });

    // 添加天地图图层
    url = "http://localhost:8090/iserver/services/map-tianditu-3/rest/maps/%E7%9F%A2%E9%87%8F%E5%BA%95%E5%9B%BE_%E5%A2%A8%E5%8D%A1%E6%89%98";
    new L.supermap.TiledMapLayer(url).addTo(map);

    url = "http://localhost:8090/iserver/services/map-tianditu-3/rest/maps/%E7%9F%A2%E9%87%8F%E4%B8%AD%E6%96%87%E6%B3%A8%E8%AE%B0_%E5%A2%A8%E5%8D%A1%E6%89%98";
    new L.supermap.TiledMapLayer(url).addTo(map);
//http://localhost:8090/iserver/services/map-baidu/rest/maps/normal
//     url = "http://localhost:8090/iserver/services/map-baidu/rest/maps/normal";
//     new L.supermap.TiledMapLayer(url).addTo(map);

    // 监听盲人Show按钮的点击事件
    document.querySelectorAll('.custom-btn1').forEach(function (button) {
        button.addEventListener('click', async function (event) {
            event.preventDefault(); // 阻止默认提交行为

            // 从表单中获取 bid
            var tdElement = this.closest('td');
            var userIdInput = tdElement.querySelector('input[name="bid"]');
            var bid = userIdInput.value;

            try {
                const response = await fetch("/relation/gethelpinfow?bid=" + bid);
                const data = await response.json();

                //清除现有的标记
                map.eachLayer(function (layer) {
                    if (layer instanceof L.CircleMarker) {
                        map.removeLayer(layer);
                    }
                });
                let color = 'green';

                // 添加新的标记
                data.forEach(user => {

                    const marker = L.circleMarker([user.lat, user.lon], {color}).addTo(map);
                    marker.bindPopup(`用户ID: ${user.bid}<br>志愿者ID: ${user.vid}<br>求助时间: ${user.btime}<br>结束时间: ${user.etime}<br>位置: ${user.address}`);
                });
            } catch (error) {
                console.error('Error fetching data:', error);
            }
         });
     });
// 监听志愿者Show按钮的点击事件
    document.querySelectorAll('.custom-btn2').forEach(function (button) {
        button.addEventListener('click', async function (event) {
            event.preventDefault(); // 阻止默认提交行为

            // 从表单中获取 bid
            var tdElement = this.closest('td');
            var userIdInput = tdElement.querySelector('input[name="vid"]');
            var bid = userIdInput.value;

            try {
                const response = await fetch("/relation/gethelpinfov?vid=" + bid);
                const data = await response.json();

                //清除现有的标记
                map.eachLayer(function (layer) {
                    if (layer instanceof L.CircleMarker) {
                        map.removeLayer(layer);
                    }
                });
                let color = 'yellow';

                // 添加新的标记
                data.forEach(user => {

                    const marker = L.circleMarker([user.lat, user.lon], {color}).addTo(map);
                    marker.bindPopup(`视障人士ID: ${user.bid}<br>求助时间: ${user.btime}<br>结束时间: ${user.etime}<br>位置: ${user.address}`);
                });
            } catch (error) {
                console.error('Error fetching data:', error);
            }
        });
    });



}

// 工具条点击效果
function mapActive(){
    $(".map_top>ul>li").click(function(){
        $(this).addClass("active").siblings().removeClass("active");
        $(this).find("a").addClass("active");
        $(this).find("a").parents("li").siblings().find("a").removeClass("active");
    })
}
